<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
    <title>办公管理系统-添加音乐</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="pragma" content="no-cache"/>
    <meta http-equiv="Cache-Control" content="no-cache, must-revalidate"/>
    <meta name="Keywords" content="keyword1,keyword2,keyword3"/>
    <meta name="Description" content="网页信息的描述"/>
    <meta name="Copyright" content="All Rights Reserved."/>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resources/bootstrap/css/bootstrap.min.css"/>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resources/easyUI/easyui.css">
</head>
<body style="background: #F5FAFA;">
<form id="addUserForm" action="" method="post" style="margin-top: 10px;">
    <table class="table-condensed" align="center">
        <tbody>
        <tr>
            <td><label>音乐标题:</label></td>
            <td><input type="text" id="musicName" name="musicName" class="form-control" placeholder="请输入音乐标题"></td>
        </tr>
        <tr>
            <td><label>序号:</label></td>
            <td><input type="text" id="sequence" name="sequence" class="form-control" placeholder="请输入序号"></td>
        </tr>
        <tr>
            <td><label>音乐地址:</label></td>
            <td><input type="file" id="musicUrl" name="musicUrl" onchange="doUpload('musicUrl');"><input id="url_id" type="hidden"></td>
        </tr>
        </tbody>
    </table>
    <div align="center" style="margin-top: 20px;">
        <a id="btn_submit" class="btn btn-info"><span class="glyphicon glyphicon-plus"></span>&nbsp;添加</a>
        <button type="reset" class="btn btn-danger"><span class="glyphicon glyphicon-remove"></span>&nbsp;重置
        </button>
    </div>
</form>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/jquery/jquery.min.js"></script>
<script type="text/javascript"
        src="${pageContext.request.contextPath}/resources/jquery/jquery-migrate-1.2.1.min.js"></script>
<!-- 导入bootStrap的库 -->
<script type="text/javascript"
        src="${pageContext.request.contextPath}/resources/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/easyUI/jquery.easyui.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/easyUI/easyui-lang-zh_CN.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/resources/plugins/layer/2.4/layer.js"></script>
<script type="text/javascript"
        src="${pageContext.request.contextPath}/resources/plugins/layer/2.4/LayConstant.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/md5.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/ajaxfileupload.js"></script>
<script type="text/javascript">

    //上传音乐
    function doUpload(file_id){
        var str = $("#"+file_id).val(); //获取文件路径
        if(!str){
            return 0;
        }
        var arr =str.split(".");//注split可以用字符或字符串分割
        var suffix=arr[arr.length-1];//这就是要取得文件扩展名
        if(suffix!="mp3"){
            layer.msg('请选择音乐!',{icon:1,time:2000});
            return 0;
        }
        $('#btn_submit').text("正在上传");
        $.ajaxFileUpload({
            url: '${pageContext.request.contextPath}/music/musicUploadTemp.jspx', //用于文件上传的服务器端请求地址
            secureuri: false, //是否需要安全协议，一般设置为false
            fileElementId: file_id, //文件上传域的ID
            dataType: 'json', //返回值类型 一般设置为json
            success: function (data, status){
                if(data.code==0){
                    $('#btn_submit').text("保存");
                    layer.msg("上传成功！", {icon: 1, time: LayUIConstant.TIP_TIME});
                    $("#url_id").val(data.content);
                }else{
                    layer.msg("上传失败!", {icon: 5, time: LayUIConstant.TIP_TIME});
                }
            },
            error: function (data, status, e){//服务器响应失败处理函数
                alert(e);
            }
        });

    }

    //增加链接
    $("#btn_submit").click(function () {
        var musicName = $("#musicName").val();
        if ($.trim(musicName) == "") {
            layer.msg("请输入音乐标题!", {icon: 5, time: LayUIConstant.TIP_TIME});
            $("#musicName").focus();
            return;
        }
        var sequence = $("#sequence").val();
        if ($.trim(sequence) == ""){
            layer.msg("请输入序号!", {icon: 5, time: LayUIConstant.TIP_TIME});
            $("#sequence").focus();
            return;
        }
        var str = /^\d+$/ ;
        if(!str.test(sequence)){
            layer.msg("请输入正确的序号!", {icon: 5, time: LayUIConstant.TIP_TIME});
            return;
        }

        var musicUrl = $("#url_id").val();
        if ($.trim(musicUrl) == "") {
            layer.msg("请输入音乐地址!", {icon: 5, time: LayUIConstant.TIP_TIME});
            $("#musicUrl").focus();
            return;
        }

        $.ajax({
            url: '${pageContext.request.contextPath}/music/submitAddMusic.jspx',
            data: {"musicName": musicName, "musicUrl": musicUrl,"sequence":sequence},
            type: 'post',
            dataType: 'json',
            success: function (data) {
                if (data.code == 0) {
                    layer.msg(data.message, {icon: 1, time: LayUIConstant.TIP_TIME});
                    setTimeout(function () {
                       parent.location.reload();
                     }, 1500);
                } else {
                    layer.msg(data.message, {icon: 5, time: LayUIConstant.TIP_TIME});
                }
            },
            error: function (data) {
                layer.msg(data.message, {icon: 5, time: LayUIConstant.TIP_TIME});
            }
        });
    });
</script>

</body>
</html>